<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>导航栏</title>
  <link rel="stylesheet" href="navbar.css">
</head>

<body>
  <div class="navbar" id="myNavbar">
    <img src="../../images/avatar.webp" alt="头像" class="avatar"/>
    <!-- 包裹昵称链接到下拉容器 -->
    <div class="dropdown">
      <a href="javascript:void(0);" id="userNickname" onclick="toggleDropdown()">张三</a>
      <div id="myDropdown" class="dropdown-content">
        <a href="#profile">个人信息</a>
        <a href="#" onclick="logout()">退出登录</a>
      </div>
    </div>
    <!-- 修改为下拉列表 -->
    <div class="dropdown">
      <a  class="icon" onclick="toggleIconDropdown(event)">
        ☰
      </a>
      <div id="iconDropdown" class="dropdown-content">
        <!-- 这里可以添加下拉列表项 -->
        <a href="#">菜单项 1</a>
        <a href="#">菜单项 2</a>
        <a href="#">菜单项 3</a>
      </div>
    </div>
  </div>

  <script src="navbar.js"></script>
</body>
</html>